<template>
	<!-- 参与砍价页面 -->
	<view class="Jy_bargain_page">
		<view class="Jy_bargain_container">
			<view class="bargain_top_image_box">
				<image src="https://f0.0sm.com/node0/2023/03/86411C14AFDA31DF-644a32be799f5a5a.png" mode="widthFix"></image>
			</view>
			<view class="bargain_shop_group">
				<view class="bargain_shop_container">
					<view class="shop-image_box">
						<image src="http://120.78.177.187:8083/crmebimage/public/mpImage/home/logo.png" mode="aspectFill"></image>
					</view>
					<view class="bargain_info_group">
						<view class="name_box">
							<text>这是商品的标题</text>
						</view>
						<view class="di_price_box">
							<text>最低价：</text>
							<text>￥</text>
							<text>580.00</text>
						</view>
						<view class="yu_number_box">
							<text>剩余：</text>
							<text>66件</text>
						</view>
						<view class="current_price_box">
							<view class="text_box">
								<text>当前:</text>
							</view>
							<view class="c_price_box">
								<text class="symbal">￥</text>
								<text>6633.2</text>
							</view>
						</view>
						<view class="down_time_group">
							<view class="down_tiem">
								<text>倒计时</text>
							</view>
							<view class="down_time_text_box">
								<text>后结束</text>
							</view>
						</view>
					</view>
					<view class="arrow_right_box">
						<u-icon name="arrow-right" color="#000000" size="14"></u-icon>
					</view>
				</view>
				
				<!-- 砍了多少, 剩余多少 -->
				<view class="bargaining_progress_bar_group">
					<view class="bargaining_progress_bar_text_box">
						<view class="left_box">
							<text class="yk_class">已砍</text>
							<text class="yk_class symbal">￥</text>
							<text class="size">78.2</text>
						</view>
						<view class="right_box">
							<text class="yk_class">还剩</text>
							<text class="yk_class symbal">￥</text>
							<text class="size">20.6</text>
						</view>
					</view>
					<view class="progress_liner_box">
						<u-line-progress :percentage="30" :showText="false" height="24rpx" activeColor="#f83600"></u-line-progress>
					</view>
					<view class="bargain_yao_number_box">
						<text>——</text>
						<text class="number_box">已有0位好友砍价成功</text>
						<text>——</text>
					</view>
					<view class="bargain_yao_button_group">
						<view class="bargain_yao_button_box" @click="">
							<text>邀请好友帮砍价</text>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 砍价记录 -->
			<view class="bargain_history_group">
				<view class="bargain_history_title_box">
					<text>砍价记录</text>
				</view>
				<view class="bargain_history_user_group">
					<view class="bargain_history_user_list" v-for="(item, index) in 4" :key="index">
						<view class="header_image_box">
							<image src="https://img95.699pic.com/photo/50088/5720.jpg_wh860.jpg" mode="aspectFill"></image>
						</view>
						<view class="user_basic_info_group">
							<view class="user_basic_name_box">
								<text>用户名/手机号</text>
							</view>
							<view class="timer_box">
								<text>2022-8-11 12:08:11</text>
							</view>
						</view>
						<view class="k_price_box">
							<text class="small_font">砍</text>
							<text class="re_color bg_font">888</text>
							<text class="re_color small_font">元</text>
						</view>
					</view>
				</view>
			</view>
			
			<!-- 商品详情 -->
			<view class="bargain_detail_group">
				<view class="bargain_detail_title_box">
					<view class="image_box">
						<image :src="detailTitileImage" mode="widthFix"></image>
					</view>
				</view>
				<view class="bargain_detail_list_group">
					<view class="bargain_detail_list" v-for="(item, index) in 5" :key="index">
						<image src="https://img95.699pic.com/photo/50088/5720.jpg_wh860.jpg" mode="widthFix"></image>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				// 商品详情背景
				detailTitileImage: this.$mAssetsPath.detailTitleImage
			};
		},
		onLoad() {
			this.getPageTitle()
		},
		methods: {
			getPageTitle() {
				uni.setNavigationBarTitle({
					title: '商品的名字'
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
@import 'bargain.scss';
</style>
